<script setup>

import {useRouter} from 'vue-router'
import {useStore} from "../../pinia/index.js";

const router = useRouter()
const store = useStore()

const courseInfo = store.currentCourse;
const enrollment = ()=>{

  console.log("enrollment")
  router.push("/orderAck");

}


const onClickLeft = () => history.back()
</script>

<template>
  <van-nav-bar
      title="标题"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
  />

  <van-image :src="courseInfo.teacher.profileUrl"></van-image>
<h2>{{courseInfo.title}}</h2>
  折扣价格:{{courseInfo.discountPrice}}元,原价:{{courseInfo.price}}<br>
  {{courseInfo.startDate}}--{{courseInfo.endDate}}
  <van-divider></van-divider>
  <van-tabs v-model:active="courseName" @click-tab="onClickTab" sticky>
    <van-tab title="课程详情" name="1">
      课程反馈

    </van-tab>
    <van-tab title="老师简介" name="2">
      <van-card
        :desc="courseInfo.teacher.profileText"
        :title="courseInfo.teacher.name"
        :thumb="courseInfo.teacher.imageUrl"
    >
      <template #tags>
        <van-tag plain type="primary">标签</van-tag>
        <van-tag plain type="primary">标签</van-tag>
      </template>
      <template #footer>
        <van-button >关注</van-button>
      </template>
    </van-card>
    </van-tab>
    <van-tab title="住宿说明" name="3">
      住宿说明住宿说明住宿说明住宿说明住宿说明

    </van-tab>
    <van-tab title="课程反馈" name="4">课程反馈</van-tab>
  </van-tabs>


  <div class="bottom-bar">
    <van-row >
      <van-col span="12">
        <van-button type="primary" size="large" color="#c4aeae">在线咨询</van-button>
      </van-col>
      <van-col span="12">
        <van-button type="primary" size="large" color = "#ffd24d" @click="enrollment()">在立即报名</van-button>
      </van-col>
    </van-row>
  </div>

  <van-back-top />
</template>



<style scoped>
.bottom-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
}
</style>